<template>
  <div class="box">
    <el-container>

      <el-aside width="200px">
        <router-view name="Navigation"></router-view>
      </el-aside>

      <el-container>

        <el-header>
          <router-view name="ToP"></router-view>
        </el-header>

        <el-main>
          <router-view name="MaiN"></router-view>
        </el-main>

      </el-container>
    </el-container>
  </div>
</template>

<script>
export default {
  data() {
    return {};
  },
};
</script>

<style>
.el-header {
    background-color: #B3C0D1;
    color: #333;
    line-height: 60px;
    padding: 0px;
}

.el-aside {
    color: #333;
    border: #b3c0d1 solid 0.5px;
}

.el-main{
  height: 500px;
}

.box {
  width: 1000px;

  border: #b3c0d1 solid 1px;
}
</style>